<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>搭配主页</title>
  <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="../css/square.css">
  <link rel="stylesheet" href="../css/common.css">
  <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css">
  <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css">
</head>
<style>
    html,body{height: 100%;width:100%;}
    .content{
        width:86%;
        margin-left:4%;
    }
    .yiguanzhu1{
        background: white;
        color:#888888;
    }
</style>
<body>
    <div class="pageTop">
            <img src="../images/profile/right_arrow.png" alt="" class='backArrow'>
            <span class="pageTitle" style="margin-left:13%;">搭配主页</span>
            <span class="pageinstr" style="opacity: 0;">哈哈哈</span>
    </div>
    <div class="content" style="width: 100%;border-radius:0;margin-left:0;margin-top:0;box-shadow:none;box-sizing: border-box;background:linear-gradient(90deg,rgba(254,90,91,1) 0%,rgba(255,138,112,1) 100%);">

    <div style='display: flex;justify-content: space-between'>
            <img src="../images/487bd14049e44235d25f28df11b0a7e9.jpeg" alt="" class="avantar" style="border-radius: 50%;margin: 0rem 1rem;">
            <div style="font-size: 12px;margin-top:0 !important;width:63%">
            <div style="display: flex;align-items: center;justify-content: flex-start">
                <span class="name" style="line-height: 29px;color: white">随便一个名字嘛随便一个名字嘛</span>
                <!-- 是否为时尚达人显示 -->
                <span class="shishang">时尚达人</span>
            </div>
            <span class="time" style="width:35%;display: inline-block;color: white">关注：44455</span>
            <span  class="time" style="width:35%;display: inline-block;color: white">粉丝：6777</span>
            </div>
            <span class="getfoucsEmpty" style="opacity: 1">
            + 关注
            </span>
    </div>

</div>

    
    <div id="" class="">
    <div class="content">
        <div style='display: flex;justify-content: space-between'>
            <img src="../images/487bd14049e44235d25f28df11b0a7e9.jpeg" alt="" class="avantar">
            <div style="font-size: 12px;margin-top:0 !important;width:63%">
            <div style="display: flex;align-items: flex-start;">
                <span class="name">随便一个名字嘛随便一个名字嘛</span>
                <!-- 是否为时尚达人显示 -->
                <span class="shishang">时尚达人</span>
            </div>
            <span class="time">2019-2-23  14:09</span>
            </div>
            <span class="getfoucsEmpty">
            + 关注
            </span>
        </div>
        <p class="instr">
            眼下的夏天，是地地道道的夏天。太阳才一露脸，天地间便弥漫开无形的热气，
            而当太阳如金色的轮子，轰隆隆滚动过来，直滚到人的头顶上时，天地间就仿佛变得火光闪闪了。
            河边的芦苇叶晒成了卷，一切植物都无法抵抗这种热浪的袭击，而昏昏欲睡地低下了头。大路上，偶尔有人走过，都是匆匆的样子，
            仿佛在这种阳光下一旦呆久了，就会被烧着似的。会游泳与不会游泳的孩子，都被这难忍的炎热逼进了河里。因此，河上到处是喧闹声。
        </p>
        <div class="allpic">
            <!-- 最多6张 -->
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
        </div>
        <div style="display: flex;width:100%;justify-content: space-between">
            <p class="tags">
            <span>可爱</span>
            <span>潮流</span>
            <span>卡哇伊</span>
            </p>
            <p style="display:flex;justify-content:flex-end;">
            <img src="../images/good.png" class="addGood" alt="" style="width:1.6rem;height:1.4rem;">
            <span class="shenglv" style="color:rgba(137,137,137,1);font-size:12px;width:2rem;line-height:1.5rem;">5648</span>
            </p>
        </div>

        </div>
        <div class="content">
        <div style='display: flex;justify-content: space-between'>
            <img src="../images/487bd14049e44235d25f28df11b0a7e9.jpeg" alt="" class="avantar">
            <div style="font-size: 12px;margin-top:0 !important;width:63%">
            <div style="display: flex;align-items: flex-start;">
                <span class="name">随便一个名字嘛随便一个名字嘛</span>
                <!-- 是否为时尚达人显示 -->
                <span class="shishang">时尚达人</span>
            </div>
            <span class="time">2019-2-23  14:09</span>
            </div>
            <span class="getfoucsEmpty">
            + 关注
            </span>
        </div>
        <p class="instr">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quod sunt, eos tenetur natus similique praesentium incidunt totam,
            laboriosam provident repudiandae facilis maiores debitis molestias cupiditate, id quidem reiciendis. Nihil, nisi!
        </p>
        <div class="allpic">
            <!-- 最多6张 -->
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
        </div>
        <div style="display: flex;width:100%;justify-content: space-between">
            <p class="tags">
            <span>可爱</span>
            <span>潮流</span>
            <span>卡哇伊</span>
            </p>
            <p style="display:flex;justify-content:flex-end;">
            <img src="../images/good.png" class="addGood" alt="" style="width:1.6rem;height:1.4rem;">
            <span class="shenglv" style="color:rgba(137,137,137,1);font-size:12px;width:2rem;line-height:1.5rem;">5648</span>
            </p>
        </div>

        </div>
        <div class="content">
        <div style='display: flex;justify-content: space-between'>
            <img src="../images/487bd14049e44235d25f28df11b0a7e9.jpeg" alt="" class="avantar">
            <div style="font-size: 12px;margin-top:0 !important;width:63%">
            <div style="display: flex;align-items: flex-start;">
                <span class="name">随便一个名字嘛随便一个名字嘛</span>
                <!-- 是否为时尚达人显示 -->
                <span class="shishang">时尚达人</span>
            </div>
            <span class="time">2019-2-23  14:09</span>
            </div>
            <span class="getfoucsEmpty">
            + 关注
            </span>
        </div>
        <p class="instr">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Quod sunt, eos tenetur natus similique praesentium incidunt totam,
            laboriosam provident repudiandae facilis maiores debitis molestias cupiditate, id quidem reiciendis. Nihil, nisi!
        </p>
        <div class="allpic">
            <!-- 最多6张 -->
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
            <img src="../images/O1CN01zMD3xz1qefDNJEyKN_!!0-item_pic.jpg" alt="">
        </div>
        <div style="display: flex;width:100%;justify-content: space-between">
            <p class="tags">
            <span>可爱</span>
            <span>潮流</span>
            <span>卡哇伊</span>
            </p>
            <p style="display:flex;justify-content:flex-end;">
            <img src="../images/good.png" class="addGood" alt="" style="width:1.6rem;height:1.4rem;">
            <span class="shenglv" style="color:rgba(137,137,137,1);font-size:12px;width:2rem;line-height:1.5rem;">5648</span>
            </p>
        </div>

        </div>
    </div>
   
 


</div>
</body>
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/jquery-weui.min.js"></script>
<script src="../js/back.js"></script>
<script>


        //点击关注
        var i = 0;
        $('.getfoucsEmpty').on('click',function(){

          if(i%2==0){
            $(this).addClass('yiguanzhu1');
            $(this).html('已关注')

          }else{
            $(this).removeClass('yiguanzhu1');
            $(this).html('+ 关注')
          }
          i++;

        })

        //点赞

        $('.addGood').on('click',function(){
          $(this).attr('src','../images/good_active.png')

        })

 

</script>
</html>
